<template>
  <div class="_wz_cent_main _wz_staffAdd">
    <Form ref="formAdd" :model="formData" label-position="right" :label-width="100" :rules="ruleValidate">
      <FormItem label="登录账号" prop="username">
        <i-input v-model="formData.username" placeholder="请填写登录账号" clearable />
      </FormItem>
      <FormItem label="用户名称" prop="name">
        <i-input v-model="formData.name" placeholder="请填写用户名称" clearable />
      </FormItem>
      <FormItem label="电子邮箱" prop="email">
        <i-input v-model="formData.email" placeholder="请填写电子邮箱" clearable />
      </FormItem>
      <FormItem label="联系电话" prop="mobile">
        <i-input v-model="formData.mobile" placeholder="请填写联系电话" clearable />
      </FormItem>
      <FormItem label="运输企业" prop="deptUuid">
        <i-select v-model="formData.deptUuid" filterable placeholder="请选择运输企业" clearable @on-change="enterpriseGroup" >
          <Option v-for="item in subDeptList" :value="item.uuid" :key="item.uuid">{{ item.deptName }}</Option>
        </i-select>
      </FormItem>
      <FormItem label="角色权限" prop="roleIdList">
        <i-select v-model="formData.roleIdList" multiple  placeholder="请选择角色权限" clearable>
          <Option v-for="item in roleList" :value="item.roleId" :key="item.roleId">{{ item.roleName }}</Option>
        </i-select>
      </FormItem>
      <FormItem label="归属部门" prop="inOrgUuid">
        <Select v-model="formData.inOrgUuid" placeholder="请选择归属部门">
          <Option v-for="item in coreInOrgList" :value="item.uuid" :key="item.uuid">{{ item.inOrgName }}</Option>
        </Select>
      </FormItem>
      <FormItem label="岗位职务" prop="inDutyName">
        <i-select v-model="formData.inDutyName" filterable allow-create @on-create="systemInDutyFun" placeholder="请选择岗位职务，可输入添加" clearable>
          <Option v-for="item in systemInDuty" :value="item.value" :key="item.value">{{ item.value }}</Option>
        </i-select>
      </FormItem>
      <Row>
        <Col span="12">
          <FormItem label="负责人状态" prop="inOrgState">
            <i-switch v-model="formData.inOrgState" :true-value="Number(1)" :false-value="Number(0)">
              <span slot="open">是</span>
              <span slot="close">否</span>
            </i-switch>
          </FormItem>
        </Col>
        <Col span="12">
          <FormItem label="使用状态" prop="status">
            <i-switch v-model="formData.status" :true-value="Number(1)" :false-value="Number(0)">
              <span slot="open">开启</span>
              <span slot="close">禁用</span>
            </i-switch>
          </FormItem>
        </Col>
      </Row>
      <FormItem><div style="color: #ed4014;">注：默认密码为“123456”</div></FormItem>
      <div class="demo-drawer-footer">
        <Button style="margin-right: 8px" @click="$emit('closeFun', false)">取消</Button>
        <Button type="primary" @click="addSubmit('formAdd')">提交</Button>
      </div>
    </Form>
  </div>
</template>
<script>


export default {
  props: ['selectData'],//接收来自父组件的数据
  data () {
    return {
      coreInOrgList:[],//部门
      subDeptList: [],//运输企业
      roleList: [],//角色
      systemInDuty:[],//职务
      formData: {},
      //验证
      ruleValidate: {
        username: [
          { required: true, message: '请填写登录账号', trigger: 'blur' },
          {
            validator: (rule, value, callBack) => {
              if (value.length > 5) {
                callBack()
              } else {
                callBack('登录账号最少6位')
              }
            }, trigger: 'blur'
          }
        ],
        name: [
          { required: true, message: '请填写用户名称', trigger: 'blur' },
        ],
        roleIdList: [
          { type: "array", required: true, message: "请至少选择一个角色权限", trigger: "change" }
        ],
        email: [
          { type: 'email', message: '电子邮件格式不正确', trigger: 'blur' }
        ],
        deptUuid: [
          { required: true,message: '请选择运输企业', trigger: 'blur' }
        ],
        inOrgUuid: [
          { required: true,message: '请选择归属部门', trigger: 'blur' }
        ],
      },
    }
  },
  beforeCreate () {//beforeCreate创建前状态


  },
  created () {//created创建完毕状态

  },
  beforeMount () {//beforeMount挂载前状态   DOM 元素然后塞入页面的过程


  },
  mounted () {//mounted 挂载结束状态
    var that = this

    that.formData =  that.selectData;

    that.$set(that.formData, 'inOrgUuid', !!that.formData.inOrgUuid?that.formData.inOrgUuid:'')//赋值
    that.$set(that.formData, 'inOrgState', !!that.formData.inOrgState ? 1 : 0)//赋值
    that.enterpriseGroup(that.formData.deptUuid);


    //运输企业
    that.axios.post(that.apiUrl.coreDeptCoreDeptList, {}).then(res => {
      if (!!res) {
        that.subDeptList = res.data.data;
        if (!!!that.formData.deptUuid) {
          that.$set(that.formData, 'deptUuid', that.subDeptList[0].uuid)//赋值
          that.$set(that.formData, 'deptName', that.subDeptList[0].deptName)//赋值
          that.enterpriseGroup(that.formData.deptUuid)
        }
      }
    }).catch(err => {
      console.log("失败", err)
    })

    //职务
    that.axios.post(that.apiUrl.coreDeptDictCoreDeptDictPageList, {type: "system_in_duty"}).then(res => {
      if (!!res) {
        that.systemInDuty = res.data.data//返回数据
      }
    }).catch(err => {
      console.log("失败", err)
    })

  },
  methods: {//执行的方法
    //岗位 添加
    systemInDutyFun(data){
      var that = this;
      //企业自己保险字典
      var obj = {
        type: "system_in_duty",
        name: "岗位职务",
        value: data
      }
      that.systemInDuty.push({
        value: data,
        label: data
      })
      that.axios.post(that.apiUrl.coreDeptDictCoreDeptDictSaveOrUpdate,  obj);
    },
    //企业级联
    enterpriseGroup(data){
      let that = this;
      if(!!data){
        //岗位
        that.axios.post(that.apiUrl.coreInOrgCoreInOrgList,{deptUuid:that.formData.deptUuid,inOrgType:1}).then(res => {
          if (!!res) {
            that.coreInOrgList = res.data.data;
          }
        }).catch(err => {
          console.log("失败", err)
        })


        //角色
        that.axios.post(that.apiUrl.systemRoleSystemRoleList, {deptUuid:that.formData.deptUuid}).then(res => {
          if (!!res) {
            that.roleList = res.data.data//返回数据
            if(that.roleList.length == 0){
              that.$set(that.formData, 'roleIdList', [])//赋值
            }
          }
        }).catch(err => {
          console.log("失败", err)
        })
      }else{
        that.coreInOrgList = [];
        that.roleList = [];
      }
    },

    addSubmit (name) {//新增修改提交
      var that = this
      that.$refs[name].validate((valid) => {
        if (valid) {//正则判断使用

          that.formData.status = (!!that.formData.status) ? that.formData.status : 0//如果 状态没有数据、0、false 统一设置 0
          that.$Spin.show()
          that.axios.post(that.apiUrl.systemUserSystemUserSaveOrUpdate, that.formData).then(res => {
            that.$Spin.hide()
            if (!!res) {
              that.$Message.success('保存成功.')
              that.$emit("closeFun", true)
            }
          }).catch(err => {
            console.log("失败", err)
          })
        } else {
          that.$Message.error('请正确填写表单')
        }
      })
    },
  },
  watch: {//监听

  },
  beforeUpdate () {//beforeUpdate 更新前状态

  },
  updated () {//updated 更新完成状态

  },
  beforeDestroy () {//beforeDestroy 销毁前状态

  },
  destroyed () {//destroyed 销毁完成状态

  }
}
</script>

<style lang="less">
._wz_staffAdd {

}
</style>

